//---------------------------
// Header
//---------------------------

.logo-column{
  position: relative;
  float: left;
  padding-right: half($line-height__base);
  padding-left: half($line-height__base);

  @media #{$large-up} {
    float: none;
    text-align: center;
    text-indent: 60px;
    margin: 0 auto;
  }
}

.logo {
  display: block;
  margin-bottom: 0;
  line-height: $line-height__base;

  @media #{$medium-down} {
    font-size: 1.5em;
    line-height: $line-height__medium;
  }

  a {
    transition: $base-transition-speed;
    text-decoration: none;
    letter-spacing: 1px;

    @media #{$large-up} {
      letter-spacing: 50px;
    }

    &:hover { color: $color__type--hover; }
  }

  &__img {
    max-height: $line-height__base;
    vertical-align: middle;
  }
}

.site-header {
  position: relative;
  padding: half($line-height__medium) 0;
  line-height: $line-height__medium;

  @media #{$large-up} {
    position: relative;
    z-index: 100;
    width: 100%;
  }

  @media #{$large-up} { padding: half($line-height__base) 0; }
}